# Event List

This chapter introduces all events available in Umo Viewer.

## Usage Example

```vue {4-6}
<template>
  <umo-viewer
    v-bind="options"
    @close="onClose"
    @edit="onEdit"
    @validate-password="onValidatePassword"
  />
</template>

<script setup>
  import { ref } from 'vue';
  import { UmoViewer } from '@umoteam/viewer';

  const options = ref({
    // Configuration options
    lang: 'zh-CN',
    // ...
  });

  // Close event, e.g., close a dialog when triggered
  const onClose = () => {
    console.log('Close event');
  };

  // Edit event
  const onEdit = () => {
    console.log('Edit event');
  };

  // Password validation event
  const onValidatePassword = (password) => {
    if (password === '123456') {
      return true;
    }
    return false;
  };
</script>
```

## Event Details

### onClose

**Description**: Triggered when the close button is clicked, e.g., to close a dialog.

**Type**: `() => void`

**Default**: `undefined`

### onEdit

**Description**: Triggered when the edit button is clicked. If the [editable option](./options#editable) is enabled, this event must be configured.

**Type**: `() => void`

**Default**: `undefined`

### onValidatePassword

**Description**: Triggered when a password is required to access the document. Return `true` if the password is correct, otherwise return `false`. Supports asynchronous validation.

**Type**: `(password: string) => boolean | Promise<boolean>`

**Default**: `undefined`
